<template>
  <!-- 设备台账 -->
  <Layout>
       <Form ref="form1" :model="form1" :label-width="120">
        <Row  v-show="!switchFlag" class="query-form" style="padding-top: 15px">
            <Col span="8">
                <FormItem label="厂家名称：">
                    <Input class="query-form-el" type="text" v-model="factoryName"></Input>
                </FormItem>
            </Col>
            <Col span="8" offset="8">
                <Button @click="reset" class="ivu-btn-reset"  >重置</Button>
                <Button type="primary" class="ivu-btn-query"   icon="md-search"  @click="queryFactory">查询</Button>
            </Col>
        </Row>
        <Row  v-show="switchFlag" class="query-form" style="padding-top: 8px">
            <Col span="8">
                <FormItem label="厂家名称：">
                    <Input class="query-form-el" type="text" v-model="factoryName"></Input>
                </FormItem>
            </Col>
        </Row>
        <Row v-show="switchFlag" class="query-form">
            <Col span="24">
                <Button @click="switchQuery(false)" class="ivu-btn-switch" type="text"  >收起∧</Button>
                <Button @click="reset" class="ivu-btn-reset"   >重置</Button>
                <Button type="primary" class="ivu-btn-query"   icon="md-search" @click="queryFactory">查询</Button>
            </Col>
        </Row>
        <Row class="query-form">
            <Col span="24">
                <Button size="large"  class="ivu-btn-add" icon="md-add"  @click="addFactory">新增</Button>
                <!--<Button size="large"  class="ivu-btn-delete" icon="md-trash" @click="batDelete">删除</Button>-->
            </Col>
        </Row>
      </Form>
     
      <Table ref='table' :height="tableHeight" :loading="loading" size="small" :row-class-name="rowClassName" no-data-text="没有查询到相关数据!"
           stripe border :columns="columns1"   @on-selection-change = 'getSelectRows' :data="resultData">
      </Table>
      <!-- 底部分页条 -->
    <Row style="margin-right:10px;">
        <Col span="24" >
                <Page style="float: right" 
                :total="dataCount" 
                :page-size="pageSize" 
                @on-change="changepage"
                 @on-page-size-change="nowPageSize" 
                 :page-size-opts="pageSizeArray" show-total show-sizer show-elevator />
        </Col>
    </Row>

    <Modal  title="生产厂家" :transfer=false v-model="model1"  :width=600 >
        <Row>
            <Col span="24">
                <Form ref="formCustom" :model="formCustom" :rules="ruleValidate"  label-position="top">
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="厂家名称" prop="factoryName">
                                <Input type="text" v-model="formCustom.factoryName"></Input>
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="厂家简称" prop="factoryNameAbbre">
                                <Input type="text" v-model="formCustom.factoryNameAbbre"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="厂家地址" prop="factoryAddress">
                                <Input  v-model="formCustom.factoryAddress" type="text"></Input>
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="主营业务" prop="mainBusiness">
                                <Input  v-model="formCustom.mainBusiness" type="text"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="法人代表" prop="legalPerson">
                                <Input  v-model="formCustom.legalPerson" type="text"></Input>
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="联系电话" prop="cTelephone">
                                <Input  v-model="formCustom.cTelephone" type="text"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                   <!-- <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="注册资金" prop="regisierMoney">
                                <Input  v-model="formCustom.regisierMoney" type="text"></Input>
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="售后电话" prop="servicePhone">
                                <Input  v-model="formCustom.servicePhone" type="text"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="销售负责人" prop="contactPerson">
                                <Input  v-model="formCustom.contactPerson" type="text"></Input>
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="生产许可证" prop="productPermitLic">
                                <Input  v-model="formCustom.productPermitLic" type="text"></Input>
                            </FormItem>
                        </Col>
                    </Row>-->
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="23">
                            <FormItem label="备注" prop="notes">
                                <Input type="textarea" v-model="formCustom.notes"></Input>
                            </FormItem>
                        </Col>
                    </Row>
                     <!--<Row type="flex" justify="center" class="code-row-bg">
                        <Col span="23" >
                            <FormItem>
                                <Button type="primary"  class='ivu-btn-save' :loading="buttonLoading" @click="submit('form1datacopy')" >确定</Button>
                                <Button type="primary"  class='ivu-btn-cancel' @click="handleCancel" >取消</Button>
                            </FormItem>
                        </Col>
                    </Row>-->
                </Form>
            </Col>
        </Row>
        <div slot="footer">
            <Button type="primary"  class='ivu-btn-save' :loading="buttonLoading" @click="submit('form1datacopy')" >确定</Button>
            <Button type="primary"  class='ivu-btn-cancel' @click="handleCancel" >取消</Button>
        </div>
    </Modal>

    <Modal title="生产厂家" :transfer=false v-model="model2" :width=800 class="modal-view-detail">
        <Row>
            <Col span="24">
                <Form  :model="showdata" :label-width="160" >
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="厂家名称" prop="factoryName">
                                {{showdata.factoryName}}
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="厂家简称" prop="factoryNameAbbre">
                                {{showdata.factoryNameAbbre}}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="厂家地址" prop="factoryAddress">
                                {{showdata.factoryAddress}}
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="主营业务" prop="mainBusiness">
                                {{showdata.mainBusiness}}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="法人代表" prop="legalPerson">
                                {{showdata.legalPerson}}
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="联系电话" prop="cTelephone">
                                {{showdata.cTelephone}}
                            </FormItem>
                        </Col>
                    </Row>
                   <!-- <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="注册资金" prop="regisierMoney">
                                {{showdata.regisierMoney}}
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="售后电话" prop="servicePhone">
                                {{showdata.servicePhone}}
                            </FormItem>
                        </Col>
                    </Row>
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="11">
                            <FormItem label="销售负责人" prop="contactPerson">
                                {{showdata.contactPerson}}
                            </FormItem>
                        </Col>
                        <Col span="11">
                            <FormItem label="生产许可证" prop="productPermitLic">
                                {{showdata.productPermitLic}}
                            </FormItem>
                        </Col>
                    </Row>-->
                    <Row type="flex" justify="space-around" class="code-row-bg">
                        <Col span="23">
                            <FormItem label="备注" prop="notes">
                                {{showdata.notes}}
                            </FormItem>
                        </Col>
                    </Row>
                    <!--<Row>
                        <Col span="23" >
                            <FormItem>
                                <Button class='ivu-btn-save' @click="model2=false">关闭</Button>
                            </FormItem>
                        </Col>
                    </Row>-->
                </Form>
            </Col>
        </Row>
        <div slot="footer">
            <Button class='ivu-btn-save' @click="model2=false">关闭</Button>
        </div>
    </Modal>
  </layout>

</template>

<script>
    import {
        Api
    } from "../../../../api/index.js"

    import {sessionStorage} from '@/common/cacheUtils.js';
    export default {
        data() {
            return {
                switchFlag:false,
                formCustom: {},
                factoryName: '',
                form1:{},
                tableHeight: 450,
                loading: false,
                styleArr: [{
                    lineHeight: '30px',
                    width: '220px'
                }],
                divStyle: {
                    marginTop: '20px'
                },
                btn: {
                    width: '80px',
                    height: '36px',
                    color: '#fff',
                    borderRadius: '4px',
                    border: '1px solid #dcdee2',
                    textAlign: 'center',
                    verticalAlign: 'middle',
                    marginLeft: '10px',
                },
                pageSizeArray: [5, 10, 20, 50],
                dataCount: 0,
                pageSize: 10,
                currentPage: 1,
                columns1: [
                    {
                        title: "序号",
                        width: 80,
                        align: "center",
                        fixed:'left',
                        render: (h, params) => {
                            return h('span', params.index + (this.currentPage - 1) * this.pageSize + 1);
                        }
                    },
                    {
                        title: '厂家名称',
                        align: 'center',
                        key: 'factoryName'
                    },
                    {
                        title: '厂家简称',
                        key: 'factoryNameAbbre',
                        align: 'center'
                    },
                    {
                        title: '厂家地址',
                        align: 'center',
                        key: 'factoryAddress'
                    },
                    {
                        title: '主营业务',
                        align: 'center',
                        key: 'mainBusiness'
                    },
                    {
                        title: '联系电话',
                        align: 'center',
                        key: 'cTelephone'
                    },
                   /* {
                        title: '邮箱',
                        align: 'center',
                        key: 'cEmail'
                    },*/
         /*           {
                        title: '所属公司',
                        align: 'center',
                        key: 'belongCompanyName'
                    },
                    {
                        title: '所属行业',
                        align: 'center',
                        key: 'belongBusinessName'
                    }, */
                    {
                        title: '备注',
                        align: 'center',
                        key: 'notes'
                    },
                    {
                        title: '操作',
                        key: 'action',
                        fixed: 'right',
                        width: 200,
                        align: 'center',
                        render: (h, params) => {
                            return h('div', [
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        fontSize: '14px'
                                    },
                                    on: {
                                        click: () => {
                                            this.showData(params,1);
                                        }
                                    }
                                }, '详情'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        color: params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||  this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId ) ||sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined
                                        ||sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined? '':'#d0d0d0' ,
                                        pointerEvents: params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||  this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId )||sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined
                                        ||sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined? '' : 'none'
                                    },
                                    on: {
                                        click: () => {
                                             this.showData(params,2);
                                        }
                                    }
                                }, '修改'),
                                h('Divider', {
                                    props: {
                                        type: 'vertical',
                                    }
                                }, ''),
                                h('A', {
                                    props: {
                                        type: 'primary',
                                        size: 'small'
                                    },
                                    style: {
                                        color: params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||  this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId ) ||sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined
                                        ||sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined? 'red':'#d0d0d0' ,
                                        pointerEvents: params.row.createUserId == sessionStorage('userId').getObject('userId').userId ||  this.Common.userIdList.includes(sessionStorage('userId').getObject('userId').userId )||sessionStorage('userId').getObject('userId').userRole.find(obj => obj.roleId == '73b38b37dff64392ba0ee7dd579bf293') != undefined
                                        ||sessionStorage('userId').getObject('userId').userBeHandedOver.find(obj => obj == params.row.createUserId) != undefined? '' : 'none'
                                    },
                                    on: {
                                        click: () => {
                                            this.deleteData(params);
                                        }
                                    }
                                }, '删除'),
                            ]);
                        }
                    }
				],
                showdata: {},
                model1: false,
                buttonLoading: false,model2: false,
                add: false,
                select: {},
                deleteRows: [],
                resultData: [],
                ruleValidate: {
                    factoryName: [
                    { required: true, message: " ", trigger: "change" }
                    ],
                   /* legalPerson: [
                    { required: true, message: " ", trigger: "change" }
                    ],*/
                    /*productPermitLic: [
                    { required: true, message: "生产许可不能为空", trigger: "change" }
                    ]*/
                 }
            }
        },
        mounted: function() {
            this.tableHeight = window.innerHeight - this.$refs.table.$el.offsetTop - 145;
            //页面加载执行的查询函数,返回的总条数,激活前端分页插件的页码功能.
            this.queryFactory();
        },
        methods: {
            switchQuery(flag){
                this.switchFlag = flag;
                if(!this.switchFlag){
                    this.tableHeight = window.innerHeight - 220;
                }else{
                    this.tableHeight = window.innerHeight - 270;
                }
            },
            modalcancel() {
                this.formCustom = {};
                this.model = false;
            },
            addFactory() {
                this.formCustom = {
                    factoryName: '',
                    factoryId: '',
                    factoryNameAbbre: '',
                    shortnameEn: '',
                    factoryAddress: '',
                    mainBusiness: '',
                    cTelephone: '',
                    cEmail: '',
                    legalPerson: '',
                    licenseNo: '',
                    registerMoney: '',
                    servicePhone: '',
                    contactPerson: '',
                    productPermitLic: '',
                    notes: '',
                    belongCompanyId: ''
                }
                this.model1 = true;
            },
            //重置输入框
            reset: function() {
                this.factoryName = '';
            },
            handleCancel() {
                this.formCustom = {};
                this.model1 = false;
            },
            //添加
            submit() {
                this.$refs["formCustom"].validate((valid) => {
                    if (valid) { this.buttonLoading=true
                        if (this.formCustom.factoryId == "") {
                            this.$http.post(Api.factoryUrl, this.formCustom).then((res) => {
                                if (res.data.status == 200) {
                                    this.queryFactory();
                                    this.model1 = false;
                                    this.$Message.info('添加成功');
                                } else {
                                    this.$Message.info(res.data.message);
                                } this.buttonLoading=false
                            });
                        } else {
                            this.$http.put(Api.factoryUrl, this.formCustom).then((res) => {
                                if (res.data.status == 200) {
                                    this.queryFactory();
                                    this.model1 = false;
                                    this.$Message.info('修改成功');
                                } else {
                                    this.$Message.info(res.data.message);
                                } this.buttonLoading=false
                            });
                        }
                    }
                });
            },
            showData(data, flag) {
                if (flag == 1) {
                    //查看页面
                    this.showdata = data.row;
                    this.model2 = true;
                } else {
                    //修改页面
                    this.formCustom = data.row;
                    this.model1 = true;
                }
            },

            getSelectRows (rows){
                this.deleteRows = rows;
            },
            batDelete(){
                let factoryId = '';
                this.deleteRows.forEach(item=>{
                    factoryId = factoryId  + item.factoryId + ","
                });
                factoryId = factoryId.substring(0, factoryId.length - 1);
                this.$http.delete(Api.factoryUrl + '/' + factoryId).then((res) => {
                        if (res.data.status == 200) {
                            this.$Message.info('删除成功');
                            this.queryFactory();
                        } else {
                            this.$Message.info('删除失败');
                        }
                    });
            },
            deleteData(params) {
                 let istrue = confirm("是否确定删除?");
                 if (istrue) {
                    this.$http.delete(Api.factoryUrl + '/' + params.row.factoryId).then((res) => {
                        if (res.data.status == 200) {
                            this.$Message.info('删除成功');
                            this.queryFactory();
                        } else {
                            this.$Message.info('删除失败');
                        }
                    });
                }
            },
            // 查询编码大类列表
            getInfo: function() {this.loading = true ;
                if (this.factoryName == undefined) {
                    this.factoryName = "";
                }
                this.$http.get(Api.queryFactory + "?starPage=" + this.currentPage + "&size=" +
                    this.pageSize + "&factoryName=" + this.factoryName).then((res) => {
                    this.dataCount = res.data.data.totalSize; //总条数
                    this.resultData = res.data.data.data; //查询到的所有编码
                    this.loading = false;
                })
            },

            queryFactory() {
                this.dataCount = 0;
                this.currentPage = 1;
                this.getInfo();
            },
            changepage(pageIndex) {
                //当页码改变,选择获取当前页数,发送查询请求
                this.currentPage = pageIndex;
                this.getInfo();
            },
            nowPageSize(size) {
                this.pageSize = size;
                this.currentPage = 1;
                this.getInfo();
            },
            rowClassName(row, index) {
                return 'tdHeight';
            }
        }
    }
</script>

<style scoped lang="css">
    @import '../../../../index.css';
</style>
